@import  '../../static/style/theme/color_theme'

.home_content_wrapper
    padding: 20px 20px

.title_content_wrapper
    padding: 24px 46px 24px 40px
    box-shadow: 0 8px 2px #d9e3ed
    h5
        font-size: 22px
        color: $color_3333

    h6
        font-size: 16px
        color: $color_6666
        padding-top: 10px
    .title_h6_grey
        margin-top: 4px
        font-size: 14px !important
        color: $color_9999

.icon_content
    img
        width: 42px
        margin-top: 10px

.profile_search
    width: 200px
    margin-right: 10px

.profile_title
    border-bottom: 1px solid $color_eeee
    font-size: 18px
    padding-bottom: 6px
    background: $color_ffff
    padding: 15px
    margin-bottom: 20px

    .date_time
        font-size: 14px
        padding-left: 20px
        color: $color_6666

.flex_container
    width: 100%
    justify-content: space-between
    .flex_item
        list-style: none
        width: 24%
        display: flex
        justify-content: space-between
        align-items: center
        padding: 25px 35px
        border-radius: 5px
        background: $color_ffff
        box-shadow: 5px 5px 5px rgba(60, 139, 207, 0.15)
        h2
            font-size: 30px
        .icon_size
            width: 50px
            height: 50px
.icon_group
    text-align: center
.item_title
    font-size: 16px
    color: #333
    margin-top: 10px
    margin-bottom: 0px
.home_chart_left
    width: 50%
    margin-right: 1px
    .home_chart_split
        border-right: 1px solid $color_ebeb

.home_chart_right
    width: calc(50% - 1px)

.home_chart_tit
    text-align: center
    font-size: 18px
    color: $color_6666
    padding: 10px 0
    margin-top: 20px

.title_tags_yellow
    overflow: hidden
    position: relative

    &:after
        position: absolute
        content: ''
        width: 0
        height: 0
        top: 0
        left: 0
        border: 22px solid
        border-color: $color_ff99 transparent transparent $color_ff99
    &:before
        position: absolute
        content: ''
        width: 10px
        height: 10px
        border-radius: 10px
        background: $color_ffff
        left: 9px
        top: 9px
        z-index: 99

.title_tags_red
    overflow: hidden
    position: relative

    &:after
        position: absolute
        content: ''
        width: 0
        height: 0
        top: 0
        left: 0
        border: 22px solid
        border-color: $color_f453 transparent transparent $color_f453
    &:before
        position: absolute
        content: ''
        width: 10px
        height: 10px
        border-radius: 10px
        background: $color_ffff
        left: 9px
        top: 9px
        z-index: 99

.title_tags_grey
    overflow: hidden
    position: relative

    &:after
        position: absolute
        content: ''
        width: 0
        height: 0
        top: 0
        left: 0
        border: 22px solid
        border-color: $color_cccc transparent transparent $color_cccc
    &:before
        position: absolute
        content: ''
        width: 10px
        height: 10px
        border-radius: 10px
        background: $color_ffff
        left: 9px
        top: 9px
        z-index: 99


em
    font-style: normal
